<template>
	<view style="height: 100px;">
		<u-tabs :list="list4"></u-tabs>
		<view class="topSearch">
			<u--input class="search" shape="circle" prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399"
				placeholder="搜索职位名称、公司"></u--input>
		</view>
		<view class="mainstay">
			<u-tabs :list="list2">
			</u-tabs>
			<u-line style="position: relative;top: -3px;"></u-line>
			<view class="u-page">
				<u-list @scrolltolower="scrolltolower" style="height:700px;">
					<u-list-item v-for="(item, index) in indexList" :key="index" style="padding: 24rpx;">
						<view style="display: flex;color: #ccc;margin: 5px 0;justify-content: space-between;">
							<view style="display: flex;color: #ccc;margin: 5px 0;align-items: center;">
								<u-avatar :src="src" shape="square"></u-avatar>
								<view style="display: flex;flex-direction: column; margin-left: 5px;">
									<a style="color: #111111;">曾先生贝多音乐.人事部HR</a>
									<a style="height: 40px;display: flex;align-items: center;">可以啊！</a>
								</view>
							</view>
							<a style="color: #5A5A5A;font-size: 11px;margin: 5px 0;">昨天15：15</a>
						</view>
						<u-line style="margin-top: 14rpx;"></u-line>
					</u-list-item>
				</u-list>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				list4: [{
					name: '消息'
				}, {
					name: '看过我'
				}, {
					name: '新职位'
				}],
				indexList: [],
				list2: [{
					name: '全部',
				}, {
					name: '新招呼',
				}, {
					name: '仅沟通',
				}, {
					name: '有交换',
				}],
				list3: [{
					name: '5-10年',
				}, {
					name: '本科',
				}, {
					name: '视觉设计',
				}, {
					name: '交互设计',
				}, {
					name: '客户端',
				}],
				src: 'https://cdn.uviewui.com/uview/album/1.jpg',
				urls: [
					'https://cdn.uviewui.com/uview/album/1.jpg',
					'https://cdn.uviewui.com/uview/album/2.jpg',
					'https://cdn.uviewui.com/uview/album/3.jpg',
					'https://cdn.uviewui.com/uview/album/4.jpg',
					'https://cdn.uviewui.com/uview/album/5.jpg',
					'https://cdn.uviewui.com/uview/album/6.jpg',
					'https://cdn.uviewui.com/uview/album/7.jpg',
					'https://cdn.uviewui.com/uview/album/8.jpg',
					'https://cdn.uviewui.com/uview/album/9.jpg',
					'https://cdn.uviewui.com/uview/album/10.jpg',
				]
			}
		},
		onLoad() {
			this.loadmore()
		},
		methods: {

			click(item) {
				console.log('item', item);
			},
			scrolltolower() {
				this.loadmore()
			},
			loadmore() {
				for (let i = 0; i < 30; i++) {
					this.indexList.push({
						url: this.urls[uni.$u.random(0, this.urls.length - 1)]
					})
				}
			}
		}
	}
</script>

<style>

</style>